<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>A公司后台人事管理系统首页</title>
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" href="<c:url value='/assets/i/favicon.png'/>">
    <link rel="apple-touch-icon-precomposed" href="<c:url value='/assets/i/app-icon72x72@2x.png'/>">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <link rel="stylesheet" href="<c:url value='/assets/css/amazeui.min.css'/>" />

    <link rel="stylesheet" href="<c:url value='/assets/css/admin.css'/>">
    <link rel="stylesheet" href="<c:url value='/assets/css/app.css'/>">
    <link href="<c:url value='/css/bootstrap.min.css'/>" rel="stylesheet">

    <!-- MetisMenu CSS -->
    <link href="<c:url value='/css/metisMenu.min.css'/>" rel="stylesheet">

    <!-- DataTables CSS -->
    <link href="<c:url value='/css/dataTables.bootstrap.css'/>" rel="stylesheet">

    <!-- DataTables Responsive CSS -->
    <link href="<c:url value='/css/dataTables.responsive.css'/>" rel="stylesheet">

    <!-- Custom CSS -->
    <link href="<c:url value='/css/sb-admin-2.css'/>" rel="stylesheet">

    <!-- Custom Fonts -->
    <link href="<c:url value='/css/font-awesome.min.css'/>" rel="stylesheet" type="text/css">

    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
</head>
<script type="text/javascript">
    //批量删除
    function alldel(){
        var f=false;
        //得到要删除的主键id
        var arr=[];//用于存要删除的选中的id值
        var ck=document.getElementsByName("checkbox");//得到一组checkbox  相当于数组
        //循环这一组checkbox让每一个checkbox选中
        for(var i=0;i<ck.length;i++){
            if(ck[i].checked==true){//代表选中
                arr.push(ck[i].value);
                f=true;
            }
        }
        //alert(arr);
        //跳到删除的servlet里去
        if(f==true){
            if(confirm("您确认要删除吗？"))
                location.href="/delete?ids="+arr;
        }else{
            alert("请至少选中一条进行批量删除");
        }
    }

</script>
<body data-type="generalComponents">

<%--<%
    String userName=null;
    String  userPath=null;
    //获取在LoginServlet.java中保存在session对象中的数据
    ArrayList login=(ArrayList)session.getAttribute("user");
    if(login==null||login.size()==0){
        out.println("<script language='javascript'> alert(\"您还未登陆或者登陆过期，即将跳转至登录页面\");</script>");
        //out.println("<script language='javascript'>alert('你还未登录');");
        response.setHeader("refresh","0.5;/login.jsp");
        return ;
    }else{
        for(int i=login.size()-1;i>=0;i--){
            LoginBean nn=(LoginBean)login.get(i);
            userName=nn.getUserName();
            userPath=nn.getPath();
        }
    }
%>
<%
    String mess=(String)session.getAttribute("message");
    if("".equals(mess)  || mess==null){

    }

    else{%>
<script type="text/javascript">
    alert("<%=mess%>");
</script>
<% }
    session.setAttribute("message", "");
%>--%>
<header class="am-topbar am-topbar-inverse admin-header">
    <div class="am-topbar-brand">
        <i style="color: blue">A公司人员信息管理</i>
    </div>
    <div class="am-icon-list tpl-header-nav-hover-ico am-fl am-margin-right">

    </div>

    <button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-success am-show-sm-only" data-am-collapse="{target: '#topbar-collapse'}"><span class="am-sr-only">导航切换</span> <span class="am-icon-bars"></span></button>

    <div class="am-collapse am-topbar-collapse" id="topbar-collapse">

        <ul class="am-nav am-nav-pills am-topbar-nav am-topbar-right admin-header-list tpl-header-list">
            <li class="am-dropdown" data-am-dropdown data-am-dropdown-toggle>
                <a class="am-dropdown-toggle tpl-header-list-link" href="javascript:;">
                    <span class="am-icon-bell-o"></span> 提醒 <span class="am-badge tpl-badge-success am-round">5</span></span>
                </a>
                <ul class="am-dropdown-content tpl-dropdown-content">
                    <li class="tpl-dropdown-content-external">
                        <h3>你有 <span class="tpl-color-success">5</span> 条提醒</h3><a href="###">全部</a></li>
                    <li class="tpl-dropdown-list-bdbc"><a href="#" class="tpl-dropdown-list-fl"><span class="am-icon-btn am-icon-plus tpl-dropdown-ico-btn-size tpl-badge-success"></span> 【信息一】移动端 查看时 手机、电脑框隐藏。</a>
                        <span class="tpl-dropdown-list-fr">3小时前</span>
                    </li>
                    <li class="tpl-dropdown-list-bdbc"><a href="#" class="tpl-dropdown-list-fl"><span class="am-icon-btn am-icon-check tpl-dropdown-ico-btn-size tpl-badge-danger"></span> 移动端，导航条下边距处理</a>
                        <span class="tpl-dropdown-list-fr">15分钟前</span>
                    </li>
                    <li class="tpl-dropdown-list-bdbc"><a href="#" class="tpl-dropdown-list-fl"><span class="am-icon-btn am-icon-bell-o tpl-dropdown-ico-btn-size tpl-badge-warning"></span> 追加统计代码</a>
                        <span class="tpl-dropdown-list-fr">2天前</span>
                    </li>
                </ul>
            </li>
            <li class="am-dropdown" data-am-dropdown data-am-dropdown-toggle>
                <a class="am-dropdown-toggle tpl-header-list-link" href="javascript:;">
                    <span class="am-icon-comment-o"></span> 消息 <span class="am-badge tpl-badge-danger am-round">9</span></span>
                </a>
                <ul class="am-dropdown-content tpl-dropdown-content">
                    <li class="tpl-dropdown-content-external">
                        <h3>你有 <span class="tpl-color-danger">9</span> 条新消息</h3><a href="###">全部</a></li>
                    <li>
                        <a href="#" class="tpl-dropdown-content-message">
                                <span class="tpl-dropdown-content-photo">
                      <img src="assets/img/user02.png" alt=""> </span>
                            <span class="tpl-dropdown-content-subject">
                      <span class="tpl-dropdown-content-from"> test1</span>
                                <span class="tpl-dropdown-content-time">10分钟前 </span>
                                </span>
                            <span class="tpl-dropdown-content-font"> A的成长公司，离不开用户的支持。 </span>
                        </a>
                        <a href="#" class="tpl-dropdown-content-message">
                                <span class="tpl-dropdown-content-photo">
                      <img src="assets/img/user03.png" alt=""> </span>
                            <span class="tpl-dropdown-content-subject">
                      <span class="tpl-dropdown-content-from"> Steam </span>
                                <span class="tpl-dropdown-content-time">18分钟前</span>
                                </span>
                            <span class="tpl-dropdown-content-font"> 为了能最准确的传达所描述的问题， 建议你在反馈时附上演示，方便我们理解。 </span>
                        </a>
                    </li>

                </ul>
            </li>

            <li class="am-dropdown" data-am-dropdown data-am-dropdown-toggle>
                <a class="am-dropdown-toggle tpl-header-list-link" href="javascript:;">
                    <span class="tpl-header-list-user-nick"><%--<%=userName%>--%></span><span class="tpl-header-list-user-ico"> <img src="assets/img/<%--<%=userPath%>--%>"></span>
                </a>
                <ul class="am-dropdown-content">
                    <li><a href="/userSetting.jsp"><span class="am-icon-bell-o"></span> 资料</a></li>
                    <li><a href="#"><span class="am-icon-cog"></span> 设置</a></li>
                    <li><a href="/logout"><span class="am-icon-power-off"></span> 退出</a></li>
                </ul>
            </li>
            <li><a href="/logout" class="tpl-header-list-link"><span class="am-icon-sign-out tpl-header-list-ico-out-size"></span></a></li>
        </ul>
    </div>
</header>







<div class="tpl-page-container tpl-page-header-fixed">


    <div class="tpl-left-nav tpl-left-nav-hover">
         <div class="tpl-left-nav-list">
            <ul class="tpl-left-nav-menu">
                <li class="tpl-left-nav-item">
                    <a href="index.jsp" class="nav-link">
                        <i class="am-icon-home"></i>
                        <span>首页</span>
                    </a>
                </li>
                <li class="tpl-left-nav-item">
                    <a href="tableContract.jsp" class="nav-link tpl-left-nav-link-list">
                        <i class="am-icon-bar-chart"></i>
                        <span>合同管理</span>

                    </a>
                </li>

                <li class="tpl-left-nav-item">
                    <!-- 打开状态 a 标签添加 active 即可   -->
                    <a href="client/query" class="nav-link tpl-left-nav-link-list active">
                        <i class="am-icon-user"></i>
                        <span>客户管理</span>
                        <!-- 列表打开状态的i标签添加 tpl-left-nav-more-ico-rotate 图表即90°旋转  -->

                    </a>

                </li>

                <li class="tpl-left-nav-item">
                    <a href="tableWorker.jsp" class="nav-link tpl-left-nav-link-list">
                        <i class="am-icon-key"></i>
                        <span>人员管理</span>

                    </a>

                </li>

                <li class="tpl-left-nav-item">
                    <a href="javascript:;" class="nav-link tpl-left-nav-link-list">
                        <i class="am-icon-wpforms"></i>
                        <span>商品管理</span>

                    </a>

                </li>

                <li class="tpl-left-nav-item">
                    <a href="showdate.jsp" class="nav-link tpl-left-nav-link-list">
                        <i class="am-icon-calendar"></i>
                        <span>销售统计</span>

                    </a>
                </li>

                <li class="tpl-left-nav-item">
                    <a href="information.jsp" class="nav-link tpl-left-nav-link-list">
                        <i class="am-icon-table"></i>
                        <span>导出信息</span>

                    </a>
                </li>

            </ul>
        </div>
    </div>





    <div class="tpl-content-wrapper">
        <ol class="am-breadcrumb">
            <li><a href="#" class="am-icon-home">首页</a></li>
            <li><a href="#">客户管理</a></li>
            <%--<li class="am-active">文字显示</li>--%>

        </ol>
        <div class="tpl-portlet-components">
            <div class="tpl-block">
                <div class="am-btn-group am-btn-group-xs">
                    <a href="addClient.jsp" class="am-btn-group am-btn-group-xs">
                        <button type="button" class="am-btn am-btn-default am-btn-success"><span class="am-icon-plus"></span> 新增</button>
                    </a>

                    <button id="checkbox1" name="checkbox" type="button" class="am-btn am-btn-default am-btn-danger" onclick="alldel()"><span class="am-icon-trash-o"></span> 删除</button>

                </div>
            </div>
        </div>
        <%--貌似是从这里开始实现了分页的--%>
        <div class="panel-body">
            <table width="100%" class="table table-striped table-bordered table-ho  ver" id="dataTables-example">
                <thead>
                <tr>
                    <th></th>
                    <th >id</th>
                    <th  >姓名</th>

                    <th  >性别</th>
                    <th  >生日</th>


                    <th  >电话</th>


                    <th >邮箱</th>


                    <th style="text-align:center;">操作</th>
                </tr>
                </thead>
                <tbody>
                <c:forEach items="allClient" var="client">
                <tr>

                    <td><input type="checkbox" id="checkbox" name="checkbox" value="${client.id}"></td>
                    <td class="am-hide-sm-only" >a</td>
                    <td class="am-hide-sm-only" >b</td>
                    <td class="am-hide-sm-only" >v</td>
                    <td class="am-hide-sm-only" >b</td>
                    <td class="am-hide-sm-only" >b</td>
                    <td class="am-hide-sm-only" >${client.name}</td>
                    <td class="am-hide-sm-only" >${client.sex}</td>
                    <td class="am-hide-sm-only" >${client.email}</td>
                    <td class="am-hide-sm-only" >${client.phone}</td>
                    <td class="am-hide-sm-only" >${client.birth}</td>

                    <td>
                        <div class="am-btn-toolbar">
                            <div class="am-btn-group am-btn-group-xs">
                                <a href="alterClient.jsp?id=${client.id}">
                                    <button class="am-btn am-btn-default am-btn-xs am-text-secondary"><span class="am-icon-pencil-square-o"></span> 修改</button>
                                </a>
                                <button class="am-btn am-btn-default am-btn-xs am-text-danger am-hide-sm-only" onclick="alldel()"><span class="am-icon-trash-o"></span> 删除</button>
                            </div>
                        </div>
                    </td>
                </tr>
                </c:forEach>
                </tbody>
            </table>

        </div>
    </div>
    <div class="tpl-alert"></div>
</div>










    </div>

</div>


<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/amazeui.min.js"></script>
<script src="assets/js/app.js"></script>
<script src="./js/jquery.min.js"></script>
<script src="./js/bootstrap.min1.js"></script>
<script src="./js/metisMenu.min.js"></script>
<script src="./js/jquery.dataTables.min.js"></script>
<script src="./js/dataTables.bootstrap.min.js"></script>
<script src="./js/dataTables.responsive.js"></script>

<!-- Custom Theme JavaScript -->
<script src="./js/sb-admin-2.js"></script>

<script>
    $(document).ready(function() {
        $('#dataTables-example').DataTable({
            responsive: true
        });
    });
</script>
</body>

</html>